<template>
  <el-container class="home-container">
    <el-header>
<!--      <el-button type="info" @click="logout()">安全退出</el-button>-->
      <v-header/>
    </el-header>
    <el-container>
      <el-aside :width="collapse() ? '64px' : '200px'">
<!--      <el-aside width="200px">-->
        <a-side/>
      </el-aside>
      <el-main>
        <a-tags></a-tags>
        <router-view></router-view>
      </el-main>
    </el-container>
  </el-container>
</template>
<script>
  import vHeader from '../components/Header'
  import aSide from "./Side";
  import aTags from "./Tags";
  export default {
    name: "Home",
    data(){
      return{

      }
    },
    methods:{
      logout(){
        window.sessionStorage.clear();//清除session
        this.$router.push("/login")//回到首页
      },
      collapse(){
        return this.$store.state.collapse;
      }
    },
    components:{
      vHeader,
      aSide,
      aTags
    },
    computed:{
      // collapse(){
      //   this.$store.state.collapse;
      // }
    }
  }
</script>

<style scoped>
  /*布局样式*/
  .home-container{
    height: 100%;
  }
  .el-header, .el-footer {
    background-color: #373d41;
    color: #333;
    line-height: 60px;
  }

  .el-aside {
    background-color: #333741;
    color: #333;
    line-height: 200px;
  }

  .el-main {
    background-color: #eaedf1;
    color: #333;
  }


</style>
